{% extends 'core/base.html' %}
{% load staticfiles %}

{% block breadcrumb %}
        <li class="breadcrumb-item">Home</li>
        <li class="breadcrumb-item">Projects</li>
        <li class="breadcrumb-item active">New Project</li>
{% endblock breadcrumb%}





{% block content %}
<div class="container animated fadeIn">
        <div class="row justify-content-center">
            <div class="col-8">
                <div class="card-group">
                    <div class="card p-4 mb-5">
                        <div class="card-body">
                            {% if created %}
                              <div class="alert alert-success alert-dismissible fade show" role="alert">
                                  <button type="button" class="close" data-dismiss="alert" aria-label="Close">
                                      <span aria-hidden="true">&times;</span>
                                  </button>
                                  Congratulations, your project was created!
                              </div>
                            {% endif %}
                                {% csrf_token %}
                                <h1>Projects</h1>
                                <p class="text-muted">Create your projects here</p>

                            <form action="" method="post">
                                {% csrf_token %}
                                <div class="form-group">
                                    <div class="input-group">
                                        <div class="input-group-append">
                                            <span class="input-group-text"><i class="fa fa-user"></i></span>
                                        </div>

                                        {{ form.name }}
                                        {% if form.name.errors %}
                                            <ol>
                                            {% for error in form.name.errors %}
                                                <li><strong>{{ error|escape }}</strong></li>
                                            {% endfor %}
                                            </ol>
                                        {% endif %}
                                    </div>
                                </div>
                                <div class="form-group">
                                    <label class="col-form-label">Assign. <i>Crtl+click for multiple selection</i></label>
                                    <div class="input-group">
                                        <div class="input-group-append">
                                            <span class="input-group-text"><i class="fa fa-users"></i></span>
                                        </div>
                                        {{ form.assign }}
                                        {% if form.assign.errors %}
                                            <ol>
                                            {% for error in form.assign.errors %}
                                                <li><strong>{{ error|escape }}</strong></li>
                                            {% endfor %}
                                            </ol>
                                        {% endif %}
                                    </div>
                                </div>
                                <div class="form-group">
                                    <div class="input-group">
                                        <div class="input-group-append">
                                            <span class="input-group-text"><i class="fa fa-calculator"></i></span>
                                        </div>
                                        {{ form.efforts }}
                                        {% if form.efforts.errors %}
                                            <ol>
                                            {% for error in form.efforts.errors %}
                                                <li><strong>{{ error|escape }}</strong></li>
                                            {% endfor %}
                                            </ol>
                                        {% endif %}
                                    </div>
                                </div>
                                <div class="form-group">
                                    <label class="col-form-label">Status</label>
                                    <div class="input-group">
                                        <div class="input-group-append">
                                            <span class="input-group-text"><i class="fa fa-circle"></i></span>
                                        </div>
                                        {{ form.status }}
                                        {% if form.status.errors %}
                                            <ol>
                                            {% for error in form.status.errors %}
                                                <li><strong>{{ error|escape }}</strong></li>
                                            {% endfor %}
                                            </ol>
                                        {% endif %}
                                    </div>
                                </div>
                                <div class="form-group">
                                    <label class="col-form-label">Dead Line</label>
                                    <div class="input-group">
                                        <div class="input-group-append">
                                            <span class="input-group-text"><i class="fa fa-calendar-alt"></i></span>
                                        </div>
                                        {{ form.dead_line }}
                                    </div>

                                    {% if form.dead_line.errors %}
                                            <ol>
                                            {% for error in form.dead_line.errors %}
                                                <li><strong>{{ error|escape }}</strong></li>
                                            {% endfor %}
                                            </ol>
                                        {% endif %}
                                </div>
                                <div class="form-group">
                                    <label class="col-form-label">Company</label>
                                    <div class="input-group">
                                        <div class="input-group-append">
                                            <span class="input-group-text"><i class="fa fa-industry"></i></span>
                                        </div>
                                        {{ form.company }}
                                    </div>

                                    {% if form.company.errors %}
                                            <ol>
                                            {% for error in form.company.errors %}
                                                <li><strong>{{ error|escape }}</strong></li>
                                            {% endfor %}
                                            </ol>
                                        {% endif %}
                                </div>
                                <div class="form-group">
                                    <div class="input-group">
                                        <div class="input-group-append">
                                            <span class="input-group-text"><i class="fa fa-percent"></i></span>
                                        </div>
                                        {{ form.complete_per }}
                                    </div>

                                    {% if form.complete_per.errors %}
                                            <ol>
                                            {% for error in form.complete_per.errors %}
                                                <li><strong>{{ error|escape }}</strong></li>
                                            {% endfor %}
                                            </ol>
                                        {% endif %}
                                </div>
                                <div class="form-group">
                                    <label class="col-form-label">Description</label>
                                    <div class="input-group">
                                        <div class="input-group-append">
                                            <span class="input-group-text"><i class="fa fa-quote-left"></i></span>
                                        </div>
                                        {{ form.description }}
                                    </div>

                                    {% if form.description.errors %}
                                            <ol>
                                            {% for error in form.description.errors %}
                                                <li><strong>{{ error|escape }}</strong></li>
                                            {% endfor %}
                                            </ol>
                                        {% endif %}
                                </div>

                                <div class="">
                                    <button type="submit" class="btn btn-sm btn-success"><i class="fa fa-dot-circle-o"></i> Submit</button>
                                    <button type="reset" class="btn btn-sm btn-danger"><i class="fa fa-ban"></i> Reset</button>
                                </div>
                            </form>
                            {{ form.errors }}
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>

{% endblock %}